<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="x-ua-compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
    <title>耗材付款</title>
    <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/weui.min.css">
    <link rel="stylesheet" type="text/css" href="css/base.css">
    <link rel="stylesheet" type="text/css" href="css/common.css">
    <link rel="stylesheet" type="text/css" href="css/shop-page.css">
</head>
<body class="bgcolor" style="padding: 0 10px 20px;">
<div class="settle">
    <div class="settle-blue"></div>
    <div class="settle-date">发货日期
        <span>2017-1-17</span>
    </div>
    <ul class="settle-detail">
        <li>付款金额<span>￥50</span></li>
        <li>服务项目<span>全程可视化空调清洗服务</span></li>
        <li>所属门店<span>杭州XXX汽车服务店</span></li>
        <li>联系方式<span>13947364632</span></li>
    </ul>
    <div class="settle-pay"><span>确认付款</span></div>
</div>
<div class="settle">
    <div class="settle-blue"></div>
    <div class="settle-date">发货日期
        <span>2017-1-17</span>
    </div>
    <ul class="settle-detail">
        <li>付款金额<span>￥50</span></li>
        <li>服务项目<span>全程可视化空调清洗服务</span></li>
        <li>所属门店<span>杭州XXX汽车服务店</span></li>
        <li>联系方式<span>13947364632</span></li>
    </ul>
    <div class="settle-pay"><span>确认付款</span></div>
</div>
<div class="settle">
    <div class="settle-blue"></div>
    <div class="settle-date">发货日期
        <span>2017-1-17</span>
    </div>
    <ul class="settle-detail">
        <li>付款金额<span>￥50</span></li>
        <li>服务项目<span>全程可视化空调清洗服务</span></li>
        <li>所属门店<span>杭州XXX汽车服务店</span></li>
        <li>联系方式<span>13947364632</span></li>
    </ul>
    <div class="settle-pay"><span>确认付款</span></div>
</div>

<!--确认付款弹出框-->
<div id="dialog1" style="display: none">
    <div class="weui-mask"></div>
    <div class="weui-dialog">
        <div class="weui-dialog__hd"><strong class="weui-dialog__title">结算提醒</strong></div>
        <div class="weui-dialog__bd">是否确定结算，一经结算不可修改。</div>
        <div class="weui-dialog__ft">
            <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default">取消</a>
            <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary">确定</a>
        </div>
    </div>
</div>
</body>
<script type="text/javascript" src="config/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="config/weui.min.js"></script>
<script>
    $(function () {
        $('.settle-pay span').click(function () {
            $('#dialog1').show();
        });
        $('.weui-dialog__btn_default').click(function () {
            $('#dialog1').hide();
        });
        $('.weui-dialog__btn_primary').click(function () {
            $('#dialog1').hide();
        });
    })
</script>
</html>